<template>
  <el-dialog :model-value="props.visible" :title="props.title" width="800px" center align-center destroy-on-close @close="onClose">
    <div class="main-container dialog-container">
      <el-table v-if="page.list" v-loading="page.loading" :data="page.list">
        <el-table-column label="用户昵称" min-width="20" prop="nickname" />
        <el-table-column label="手机号码" min-width="20" prop="mobile" />
        <el-table-column label="考试时间" min-width="20" prop="examTime" />
      </el-table>
      <common-pagination v-model:page="page" @pagination="handlePage" />
    </div>
  </el-dialog>
</template>
<script setup>
  import useTable from '@/utils/table'
  import { examApi } from '@/api/exam'
  import CommonPagination from '@/components/Common/Pagination/index.vue'

  const props = defineProps({
    analysisDetail: { type: Object, default: null },
    title: { type: String, default: '详情' },
    visible: { type: Boolean, default: false }
  })

  // 关闭弹窗
  const emit = defineEmits(['close'])
  const onClose = () => {
    emit('close')
  }

  // 基础功能
  const { page, handlePage } = useTable(
    {
      page: examApi.examAnalysisDetail
    },
    props.analysisDetail
  )
</script>
